import React, { Component } from 'react';
import { base, toast, getMultiLang } from 'nc-lightapp-front';
import '../table.less';
import './index.less';
import {getTableHeight } from '../../../pubUtils/method.js';
const { NCTable, NCDiv } = base;
const defaultProps12 = {
	prefixCls: 'bee-table',
	multiSelect: {
		type: 'checkbox',
		param: 'key'
	}
};
//集团本币
let groupTit = {
	title: (<div fieldid ="groupTit">{''}</div>) /* 国际化处理： 集团本币*/,
	children: [
		{
			title: (<div fieldid ="jtbbye">{''}</div>) /* 国际化处理： 调整前余额*/,
			dataIndex: 'jtbbye',
			key: 'jtbbye',
			width: 100,
			render: (text, record, index) => <div fieldid ="jtbbye">{text ? text : <span>&nbsp;</span>}</div>
		},
		{
			title: (<div fieldid ="jtbbhl">{''}</div>) /* 国际化处理： 调整汇率*/,
			dataIndex: 'jtbbhl',
			key: 'jtbbhl',
			width: 100,
			render: (text, record, index) => <div fieldid ="jtbbhl">{text ? text : <span>&nbsp;</span>}</div>
		},
		{
			title: (<div fieldid ="tjtbbye">{''}</div>) /* 国际化处理： 调整后余额*/,
			dataIndex: 'tjtbbye',
			key: 'tjtbbye',
			width: 100,
			render: (text, record, index) => <div fieldid ="tjtbbye">{text ? text : <span>&nbsp;</span>}</div>
		},
		{
			title: (<div fieldid ="jtbbce">{''}</div>) /* 国际化处理： 差额*/,
			dataIndex: 'jtbbce',
			key: 'jtbbce',
			width: 100,
			render: (text, record, index) => <div fieldid ="jtbbce">{text ? text : <span>&nbsp;</span>}</div>
		}
	]
};
//全局本币
let globalTit = {
	title: (<div fieldid ="globalTit">{''}</div>) /* 国际化处理： 全局本币*/,
	children: [
		{
			title: (<div fieldid ="qjbbye">{''}</div>) /* 国际化处理： 调整前余额*/,
			dataIndex: 'qjbbye',
			key: 'qjbbye',
			width: 100,
			render: (text, record, index) => <div fieldid ="qjbbye">{text ? text : <span>&nbsp;</span>}</div>
		},
		{
			title: (<div fieldid ="qjbbce">{''}</div>) /* 国际化处理： 调整汇率*/,
			dataIndex: 'qjbbce',
			key: 'qjbbce',
			width: 100,
			render: (text, record, index) => <div fieldid ="qjbbce">{text ? text : <span>&nbsp;</span>}</div>
		},
		{
			title: (<div fieldid ="tqjbbye">{''}</div>) /* 国际化处理： 调整后余额*/,
			dataIndex: 'tqjbbye',
			key: 'tqjbbye',
			width: 100,
			render: (text, record, index) => <div fieldid ="tqjbbye">{text ? text : <span>&nbsp;</span>}</div>
		},
		{
			title: (<div fieldid ="qjbbce">{''}</div>) /* 国际化处理： 差额*/,
			dataIndex: 'qjbbce',
			key: 'qjbbce',
			width: 100,
			render: (text, record, index) => <div fieldid ="qjbbce">{text ? text : <span>&nbsp;</span>}</div>
		}
	]
};
let isGroupUse;
let isGlobalUse;
let dataVal;
let pk_orgVal;

class Secondpage extends Component {
	constructor(props) {
		super(props);
		this.columns1 = [
			{
				title: (<div fieldid ="index">{''}</div>) /* 国际化处理： 序号*/,
				dataIndex: 'index',
				key: 'index',
				width: '20%',
				render: (text, record, index) => <div fieldid ="index">{text ? text : <span>&nbsp;</span>}</div>
			},
			{
				title: (<div fieldid ="bzmc">{''}</div>) /* 国际化处理： 币种*/,
				dataIndex: 'bzmc',
				key: 'bzmc',
				width: '20%',
				render: (text, record, index) => <div fieldid ="bzmc">{text ? text : <span>&nbsp;</span>}</div>
			},
			{
				title: (<div fieldid ="ybye">{''}</div>) /* 国际化处理： 原币余额*/,
				dataIndex: 'ybye',
				key: 'ybye',
				width: '20%',
				render: (text, record, index) => <div fieldid ="ybye">{text ? text : <span>&nbsp;</span>}</div>
			},
			{
				title: (<div fieldid ="a">{''}</div>) /* 国际化处理： 组织本币*/,
				width: '40%',
				children: [
					{
						title: (<div fieldid ="zzbbye">{''}</div>) /* 国际化处理： 调整前余额*/,
						dataIndex: 'zzbbye',
						key: 'zzbbye',
						width: '10%',
						render: (text, record, index) => <div fieldid ="zzbbye">{text ? text : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid ="zzbbhl">{''}</div>) /* 国际化处理： 调整汇率*/,
						dataIndex: 'zzbbhl',
						key: 'zzbbhl',
						width: '10%',
						render: (text, record, index) => <div fieldid ="zzbbhl">{text ? text : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid ="tzzbbye">{''}</div>) /* 国际化处理： 调整后余额*/,
						dataIndex: 'tzzbbye',
						key: 'tzzbbye',
						width: '10%',
						render: (text, record, index) => <div fieldid ="tzzbbye">{text ? text : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid ="zzbbce">{''}</div>) /* 国际化处理： 差额*/,
						dataIndex: 'zzbbce',
						key: 'zzbbce',
						width: '10%',
						render: (text, record, index) => <div fieldid ="zzbbce">{text ? text : <span>&nbsp;</span>}</div>
					}
				]
			}
		];
		this.state = {
			tableData: [], //表格数据
			isshow: false,
			columns: [],
			mainData: {
				date: { display: '', value: dataVal || null }, //计算日期
				pk_org: { display: '', value: pk_orgVal || null } //财务组织
			},
			json: {}
		};
	}

	getMultilingual = (showData, data, transData) => {
		let callback = (json) => {
			this.setState({ json: json }, () => {
				groupTit = {
					title: (<div fieldid ="b">{this.state.json['public-000097']}</div>) /* 国际化处理： 集团本币*/,
					children: [
						{
							title: (<div fieldid ="jtbbye">{this.state.json['public-000098']}</div>) /* 国际化处理： 调整前余额*/,
							dataIndex: 'jtbbye',
							key: 'jtbbye',
							width: 100,
							className:'columnRight',
							render: (text, record, index) => <div fieldid ="jtbbye">{text ? text : <span>&nbsp;</span>}</div>
						},
						{
							title: (<div fieldid ="jtbbhl">{this.state.json['public-000099']}</div>) /* 国际化处理： 调整汇率*/,
							dataIndex: 'jtbbhl',
							key: 'jtbbhl',
							width: 100,
							className:'columnRight',
							render: (text, record, index) => <div fieldid ="jtbbhl">{text ? text : <span>&nbsp;</span>}</div>
						},
						{
							title: (<div fieldid ="tjtbbye">{this.state.json['public-000100']}</div>) /* 国际化处理： 调整后余额*/,
							dataIndex: 'tjtbbye',
							key: 'tjtbbye',
							width: 100,
							className:'columnRight',
							render: (text, record, index) => <div fieldid ="tjtbbye">{text ? text : <span>&nbsp;</span>}</div>
						},
						{
							title: (<div fieldid ="jtbbce">{this.state.json['public-000101']}</div>) /* 国际化处理： 差额*/,
							dataIndex: 'jtbbce',
							key: 'jtbbce',
							width: 100,
							className:'columnRight',
							render: (text, record, index) => <div fieldid ="jtbbce">{text ? text : <span>&nbsp;</span>}</div>
						}
					]
				};
				globalTit = {
					title: (<div fieldid ="globalTit">{this.state.json['public-000102']}</div>) /* 国际化处理： 全局本币*/,
					children: [
						{
							title: (<div fieldid ="qjbbye">{this.state.json['public-000098']}</div>) /* 国际化处理： 调整前余额*/,
							dataIndex: 'qjbbye',
							key: 'qjbbye',
							width: 100,
							className:'columnRight',
							render: (text, record, index) => <div fieldid ="qjbbye">{text ? text : <span>&nbsp;</span>}</div>
						},
						{
							title: (<div fieldid ="qjbbce">{this.state.json['public-000099']}</div>) /* 国际化处理： 调整汇率*/,
							dataIndex: 'qjbbce',
							key: 'qjbbce',
							width: 100,
							className:'columnRight',
							render: (text, record, index) => <div fieldid ="qjbbce">{text ? text : <span>&nbsp;</span>}</div>
						},
						{
							title: (<div fieldid ="tqjbbye">{this.state.json['public-000100']}</div>) /* 国际化处理： 调整后余额*/,
							dataIndex: 'tqjbbye',
							key: 'tqjbbye',
							width: 100,
							className:'columnRight',
							render: (text, record, index) => <div fieldid ="tqjbbye">{text ? text : <span>&nbsp;</span>}</div>
						},
						{
							title: (<div fieldid ="qjbbce">{this.state.json['public-000101']}</div>) /* 国际化处理： 差额*/,
							dataIndex: 'qjbbce',
							key: 'qjbbce',
							width: 100,
							className:'columnRight',
							render: (text, record, index) => <div fieldid ="qjbbce">{text ? text : <span>&nbsp;</span>}</div>
						}
					]
				};
				this.columns1 = [
					{
						title: (<div fieldid ="index">{this.state.json['public-000028']}</div>) /* 国际化处理： 序号*/,
						dataIndex: 'index',
						key: 'index',
						width: '4%',
						render: (text, record, index) => <div fieldid ="index">{text ? text : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid ="bzmc">{this.state.json['public-000081']}</div>) /* 国际化处理： 币种*/,
						dataIndex: 'bzmc',
						key: 'bzmc',
						width: '16%',
						render: (text, record, index) => <div fieldid ="bzmc">{text ? text : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid ="ybye">{this.state.json['public-000103']}</div>) /* 国际化处理： 原币余额*/,
						dataIndex: 'ybye',
						key: 'ybye',
						width: '16%',
						className:'columnRight',
						render: (text, record, index) => <div fieldid ="ybye">{text ? text : <span>&nbsp;</span>}</div>
					},
					{
						title: (<div fieldid ="zzbb">{this.state.json['public-000104']}</div>) /* 国际化处理： 组织本币*/,
						children: [
							{
								title: (<div fieldid ="zzbbye">{this.state.json['public-000098']}</div>) /* 国际化处理： 调整前余额*/,
								dataIndex: 'zzbbye',
								key: 'zzbbye',
								width: '16%',
								className:'columnRight',
								render: (text, record, index) => <div fieldid ="zzbbye">{text ? text : <span>&nbsp;</span>}</div>
							},
							{
								title: (<div fieldid ="zzbbhl">{this.state.json['public-000099']}</div>) /* 国际化处理： 调整汇率*/,
								dataIndex: 'zzbbhl',
								key: 'zzbbhl',
								width: '16%',
								className:'columnRight',
								render: (text, record, index) => <div fieldid ="zzbbhl">{text ? text : <span>&nbsp;</span>}</div>
							},
							{
								title: (<div fieldid ="tzzbbye">{this.state.json['public-000100']}</div>) /* 国际化处理： 调整后余额*/,
								dataIndex: 'tzzbbye',
								key: 'tzzbbye',
								width: '16%',
								className:'columnRight',
								render: (text, record, index) => <div fieldid ="tzzbbye">{text ? text : <span>&nbsp;</span>}</div>
							},
							{
								title: (<div fieldid ="zzbbce">{this.state.json['public-000101']}</div>) /* 国际化处理： 差额*/,
								dataIndex: 'zzbbce',
								key: 'zzbbce',
								width: '16%',
								className:'columnRight',
								render: (text, record, index) => <div fieldid ="zzbbce">{text ? text : <span>&nbsp;</span>}</div>
							}
						]
					}
				];
				this.setState({}, () => {
					this.handleSecData(showData, data, transData);
				});
			});
		};
		getMultiLang({ moduleId: 'public', domainName: 'arap', currentLocale: 'simpchn', callback });
	};

	componentDidMount() {
		this.props.onRef(this);
	}

	//改变表格表头宽度
	changeColumns = (columns) => {
		columns.map((value) => {
			if (value.key == 'index') {
				value.width = 60;
			} else {
				value.width = 140;
			}
			if (value.hasOwnProperty('children')) {
				value.children.map((val) => {
					val.width = 140;
				});
			}
		});
		return columns;
	};

	handleSecData = (showData, data, transData) => {
		if (transData) {
			dataVal = transData.queryData.date.value;
			pk_orgVal = transData.queryData.pk_org.value;
		}
		if (showData.length > 0) {
			isGroupUse = data.isGroupUsed;
			isGlobalUse = data.isGlobalUsed;
			if (isGroupUse) {
				this.columns1.push(groupTit);
				this.columns1 = this.changeColumns(this.columns1);
			}
			if (isGlobalUse) {
				this.columns1.push(globalTit);
				this.columns1 = this.changeColumns(this.columns1);
			}
			showData.map((item, i) => {
				item.key = i;
				item.index = i + 1;
			});
			this.setState(
				{
					tableData: showData,
					columns: this.columns1
				},
				() => {
					if (data.error) {
						toast({
							duration: 3, // 消失时间，默认是3秒; 值为 infinity 时不消失,非必输
							color: 'danger', // 提示类别，默认是 "success",非必输
							content: data.error // 提示内容,非必输
						});
					}
				}
			);
		}
	};

	render() {
		let { tableData } = this.state;
		return (
			<div id="secondtableId">
				<NCDiv fieldid="ncc" areaCode={NCDiv.config.TABLE} ></NCDiv>
					{tableData && (
						<NCTable
							columns={this.state.columns}
							bordered
							isDrag
							data={tableData}
							bodyStyle={{height:getTableHeight(230)}}
							scroll={{ x: true, y: getTableHeight(230) }}
							loading={false}
						/>
					)}
			</div>
		);
	}
}

Secondpage.defaultProps = defaultProps12;

export default Secondpage;
